<template>
  <div>
    <van-nav-bar
      title="我的订单"
      left-text="返回"
      left-arrow
      @click-left="back"
    >
      <template #left>
        <van-icon name="arrow-left" size="20"/>
      </template>
    </van-nav-bar>
    <van-tabs @click="onTabChange" v-model="active">
      <van-tab v-for="(item,index) in tabs" :key="index" :title="item.name">
        <component :is="item.component"/>

      </van-tab>
    </van-tabs>

  </div>
</template>

<script>
import NoDelivery from './NoDelivery'
import NoEvaluate from './NoEvaluate'
import Payment from './Payment'
import Paid from './Paid'
import all from './all'
export default {
  name: 'order',
  components: {NoEvaluate, NoDelivery, Payment, Paid, all},
  created () {
    this.active = this.$route.params.type
  },
  data () {
    return {
      active: 0,
      tabs: [
        {
          name: '全部',
          component: 'all'
        }, {
          name: '待付款',
          component: 'Payment'
        },
        {
          name: '待发货',
          component: 'Paid'
        },
        {
          name: '待收货',
          component: 'NoDelivery'
        },
        {
          name: '待评价',
          component: 'NoEvaluate'
        }
      ]
    }
  },
  methods: {
    back () {
      this.$router.back()
    },
    onTabChange (index, title) {
      // let path = this.tabs[i].path;
      // this.$router.push({name: path})
    }
  }
}
</script>

<style scoped>

</style>
